
<!DOCTYPE HTML>
<html>
	<head>
		<meta charset="utf-8">
		<title>订单查询-聚码网-站长交易平台</title>
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
		<link rel="stylesheet" href="./public/static/index/bui/bui.css">
		<script src="./public/static/index/bui/zepto.js"></script>
		<script src="./public/static/index/bui/bui.js"></script>
		<link rel="icon" href="./public/favicon.ico">
		<!-- 添加图标字体支持 -->
		<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
		<!-- 聊天在线状态管理 -->
		<script src="./public/static/index/js/chat-status.js"></script>
		<style>
            /* 图标字体样式 */
            .icon-home:before {
                content: "\f015";
                font-family: FontAwesome;
            }
            .icon-shoppingcart:before {
                content: "\f07a";
                font-family: FontAwesome;
            }
            .icon-edit:before {
                content: "\f044";
                font-family: FontAwesome;
            }
            .icon-list:before {
                content: "\f03a";
                font-family: FontAwesome;
            }
            /* 确保图标显示 */
            [class^="icon-"], [class*=" icon-"] {
                font-family: FontAwesome;
                font-style: normal;
                font-weight: normal;
                display: inline-block;
                text-decoration: inherit;
            }
            body {
                margin: 0;
                padding: 0;
                display: flex;
                flex-direction: column;
                min-height: 100vh;
            }
            main {
                flex: 1;
                overflow: scroll;
                height: calc(100vh - 100px); /* 减去底部导航的高度 */
                background-color: #fff;
            }
            footer {
                background-color: #fff;
                position: fixed;
                bottom: 0;
                left: 0;
                width: 100%;
                z-index: 1000;
            }
            .titleHidden{
                width: 100%;
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
            button[class*=bui-btn], input[type="button"][class*=bui-btn] {
                width: 30%;
            }
            .primary-outline, .primary-reverse{
                color: #ff0057;
                border-color: #ff0057;
            }
            [class*=bui-btn].primary{
                border-color: #ff0057;
            }
            .primary{
                background-color: #ff0057;
            }.bui-nav>.active {
    color: #f9342a;
    background: #fff;
}
.mini>[class*=bui-btn], .miniinput[class*=bui-input], .minitextarea[class*=bui-input], .mini[class*=bui-btn] {
    padding-top: .1rem;
    padding-bottom: .1rem;
    font-size: .21rem;
    min-height: auto;
    height: auto;
    color: #f9342a;
    border-color: #f9342a;
    width: 20%;
}
        </style>
	</head>
	<body>
        
<div class="bui-page">
	<main>
        <div class="container-xy">
            <span style="color: #e03e2d;font-size: 14px;">
                <strong>温馨提示：</strong>
            </span>
            <span style="font-size: 14px;">手机号查询为近期最近的订单，历史订单可用付款记录内的商户单号查询</span>
        </div>
        <ul class="bui-list">
            <li class="bui-btn bui-box clearactive" style="border: 1px solid #ff0057;
            margin: 0 10px;
            margin-bottom: 8px;
            border-radius: 6px;
            padding: 2px;">
                <!-- <label class="bui-label" for="phonenumber">手机号:</label> -->
                <div class="span1">
                    <div class="bui-input user-input">
                        <input id="phonenumber" type="number" value="" placeholder="请输入手机号" style="font-size: 14px;
                        text-indent: 4px;">
                    </div>
                </div>
                <div id="orderQuery" class="bui-btn round primary" style="padding: 8px 10px;font-size: 14px;">查询订单</div>
            </li>
    	</ul>
        
        <hr>
        <ul class="bui-list bui-list-thumbnail" id="orderList">
            <div style="text-align: center;margin-top: 100px;">
                <img src="./public/static/index/images/noOrder.png">
                
            
            </div>
        </ul>

        <div style="margin: 10px 10px 10px 10px;text-indent: 2em;background: rgba(235, 246, 255, .9);padding: 10px;border-radius: 6px;">
            <span style="font-size: 14px;">亲，我们竭诚为您服务，如您在我们官方旗舰店购物过程中遇到困难，请及时和我们客服联系，您不要着急，客服看见就会尽快处理！</span>
         </div>
	</main>
	<footer>
		<ul id="tabFootNav" class="bui-nav">
            <li id="homeGo" class="bui-btn bui-box-vertical">
                <a href="./index.html" style="display: flex; flex-direction: column; align-items: center; text-decoration: none; color: inherit;">
                    <i class="icon-home"></i>
                    <div class="span1">首页</div>
                </a>
            </li>
            <li id="classifyGo" class="bui-btn bui-box-vertical">
                <a href="./clsssify.html" style="display: flex; flex-direction: column; align-items: center; text-decoration: none; color: inherit;">
                    <i class="icon-list"></i>
                    <div class="span1">分类</div>
                </a>
            </li>
            <li id="shopCartGo" class="bui-btn bui-box-vertical">
                <a href="./shopCart.html" style="display: flex; flex-direction: column; align-items: center; text-decoration: none; color: inherit;">
                    <i class="icon-shoppingcart"></i>
                    <div class="span1">购物车</div>
                </a>
            </li>
            <li id="orderQueryGo" class="bui-btn bui-box-vertical">
                <a href="./orderQuery.html" style="display: flex; flex-direction: column; align-items: center; text-decoration: none; color: inherit;">
                    <i class="icon-edit"></i>
                    <div class="span1">订单</div>
                </a>
            </li>
            <!-- <li id="kflinksGo" class="bui-btn bui-box-vertical"><i class="icon-chat"></i>
                <div class="span1">客服</div>
            </li> -->
        </ul>
	</footer>
</div>

<script>
// API地址
var API_BASE_URL = "https://api.sc123.shop/";

// 设置聊天状态管理的API地址
if (window.ChatStatus) {
    window.ChatStatus.setApiBaseUrl(API_BASE_URL);
}

var kdQuery;
var orderInfo;
bui.ready(function(){
    var phonenumber = localStorage.getItem('key_mobile');
    if(phonenumber != null){
        $("#phonenumber").val(phonenumber);
        $.ajax({
            url: "/index/index/getOrderByMobile",
            data: {
                phonenumber,
            },
            type: "post",
            dataType: "json",
            success: function(data){
                bui.hint(data.msg)
                if(data.status == 1){
                    var html = "";
                    data.data.forEach(function(el, index) {
                        html +=`<li class="bui-btn bui-box" style="border-bottom:none">
                            <div class="bui-thumbnail"><img src="${el.cover}" alt=""></div>
                            <div class="span1">
                                <h3 class="item-title">${el.goods_name}</h3>
                                <p class="item-text">
                                    <font style="color: #fb0247;font-weight: bolder;">￥${el.money}</font>
                                </p>
                            </div>
                        </li>
                        <div style="text-align: right;padding: 10px;">
                            <button class="bui-btn mini info reverse ring" onclick='location.href=("https://plan.auth.sishuge.cn/index/index/home?visiter_id=&visiter_name=&avatar=&business_id=1&groupid=0&special=1	")'>在线客服</button>
                            <button class="bui-btn mini info reverse ring" onclick="ordertk(${el.id})">申请退款</button>
                            <button class="bui-btn mini info reverse ring" onclick="kdQuery(${el.express})">快递查询</button>
                            <button class="bui-btn mini info reverse ring" onclick="orderInfo(${el.id})">订单详细</button>
                        </div>
                        <hr style="height: 2px;">`;
                    });
                    $("#orderList").html(html);
                }
            },
            error: function(data){
            }
        });
    }
    
    bui.btn({id:".bui-list",handle:".bui-btn"}).load();

    $("#homeGo").on("click",function(e){
        bui.load({ url: "/index/index/index"});
    })
    $("#classifyGo").on("click",function(e){
        bui.load({ url: "/index/index/classify"});
    })
    $("#shopCartGo").on("click",function(e){
        bui.load({ url: "/index/index/shopCart"});
    })
    $("#orderQueryGo").on("click",function(e){
        bui.load({ url: "/index/index/orderQuery"});
    })
    $("#kflinksGo").on("click",function(e){
        var kflink = "https://plan.auth.sishuge.cn/index/index/home?visiter_id=&visiter_name=&avatar=&business_id=1&groupid=0&special=1	";
        if(kflink){
            bui.load({ url: "/index/index/kflinks"});
        }else{
            bui.alert("当前客服坐席无人值班");
        }
    });

    kdQuery = function (data){
        if(data == null || data == ""){
            bui.hint({ content: "<i class='icon-error'></i><br />暂未发货", position: "center", effect: "fadeInDown" });
        }else{
            window.open("https://m.kuaidi100.com/app/query/?nu="+data+"&coname=test");
        }
    }


    var $btnSend = $("#btnSend");
    $btnSend.on("click", function(argument) {
        var hasDisabled = $(this).hasClass("disabled");
        if (!hasDisabled) {
            var phonenumber = $("#phonenumber").val();
            if(phonenumber == ""){
                bui.hint({ content: "<i class='icon-error'></i><br />请输入手机号", position: "center", effect: "fadeInDown" });
            }else{
                $.ajax({
                    url: "/index/index/getCaptcha",
                    data: {
                        phonenumber
                    },
                    type: "post",
                    dataType: "json",
                    success: function(data){
                        bui.hint(data.msg)
                        if(data.status == 1){
                            $btnSend.addClass("disabled")
                            invokeSettime($btnSend);
                        }
                    },
                    error: function(data){
                    }
                });
            }
        }
    });

    function invokeSettime(obj){
        var countdown=60;
        settime(obj);
        function settime(obj) {
            if (countdown == 0) {
                obj.removeClass("disabled").text("重新获取验证码");
                obj.text("发送验证码");
                countdown = 60;
                return;
            } else {
                obj.addClass("disabled");
                obj.text("(" + countdown + ") s 重新发送");
                countdown--;
            }
            setTimeout(function() {
                settime(obj)
             } ,1000)
        }
    };

    $("#orderQuery").on("click",function(e){
        var phonenumber = $("#phonenumber").val();
        if(phonenumber == "" ){
            bui.hint({ content: "<i class='icon-error'></i><br />信息不完整", position: "center", effect: "fadeInDown" });
        }
        if(phonenumber.length != 11){
            bui.hint({ content: "<i class='icon-error'></i><br />信息不完整", position: "center", effect: "fadeInDown" });
        }else{
            $.ajax({
            url: "/index/index/getOrderByMobile",
            data: {
                phonenumber,
            },
            type: "post",
            dataType: "json",
            success: function(data){
                bui.hint(data.msg)
                if(data.status == 1){
                    var html = "";
                    data.data.forEach(function(el, index) {
                        html +=`<li class="bui-btn bui-box" style="border-bottom:none">
                            <div class="bui-thumbnail"><img src="${el.cover}" alt=""></div>
                            <div class="span1">
                                <h3 class="item-title">${el.goods_name}</h3>
                                <p class="item-text">
                                    <font style="color: #fb0247;font-weight: bolder;">￥${el.money}</font>
                                </p>
                            </div>
                        </li>
                        <div style="text-align: right;padding: 10px;">
                            <button class="bui-btn mini info reverse ring" onclick='location.href=("https://plan.auth.sishuge.cn/index/index/home?visiter_id=&visiter_name=&avatar=&business_id=1&groupid=0&special=1	")'>在线客服</button>
                            <button class="bui-btn mini info reverse ring" onclick="ordertk(${el.id})">申请退款</button>
                            <button class="bui-btn mini info reverse ring" onclick="kdQuery(${el.express})">快递查询</button>
                            <button class="bui-btn mini info reverse ring" onclick="orderInfo(${el.id})">订单详细</button>
                        </div>
                        <hr style="height: 2px;">`;
                    });
                    $("#orderList").html(html);
                }
            },
            error: function(data){
            }
        });
        }
    });

    ordertk = function(id){
        bui.alert("正在排队处理中，有疑问请联系在线客服！");
    }

    orderInfo = function(id){
        bui.load({ url: "/index/index/orderInfo?id="+id});
    }

});
</script>
</body>
</html>